<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0">
    <title>首页</title>

    <!-- 引入公共css文件  base文件按  -->
    <link rel="stylesheet/less" href="css/base.less"/>
    <!--&lt;!&ndash; 加载中 &ndash;&gt;-->
    <!--<link rel="stylesheet" href="./css/load.css"/>-->
    <!-- 引入index的css文件 -->
    <link rel="stylesheet/less" type="text/css" href="./css/brand.less">
    <script type="text/javascript" src="lib/less/less.min.js"></script>
</head>
<body>
<!-- 头部 S -->
<header>
    <div class="back">
        <!-- 记得写 a 标签的链接 -->
        <a href="index.html"></a>
    </div>
    <div class="title">
        <h1>品牌排行 - 最新优惠</h1>
    </div>
    <div class="app-down">
        <!-- 记得写 a 标签的链接 -->
        <a href="#"></a>
    </div>
</header>
<!-- 头部 E -->

<!-- 搜索框S -->
<div class="seach">
    <input type="text" value="请输入你想比价的商品"/>
    <input type="submit" value="搜索"/>
</div>
<!-- 搜索框E -->



<!-- 提示 S -->
<footer>
    <div class="footer-nav">
        <a href="#">首页</a> &nbsp;&gt;&nbsp; 全部分类 &nbsp;&gt;&nbsp; 热门品牌排行
    </div>
</footer>


<!-- 提示 D -->



<!-- 商品列表 S -->

<section>
    <div class="tip">液晶电视哪个牌子好</div>
        <ul class="number">

        </ul>
    <div class="tip">液晶电视产品销量排行</div>
        <ul class="ranking">

        </ul>
    <div class="tip">液晶电视最新评论</div>
        <ul class="message">

        </ul>
</section>


<!-- 商品列表 D -->





<!-- 牌子排行版模板 S -->


<script type="text/template" id="number_Tpl">
    {{ each result as value i  }}
    <li>
        <i class="back{{i+1}}">{{ i+1 }}</i>
        <a href="#">
            <span>{{# value.brandName}}</span>
            <p>{{# value.brandInfo}}</p>
        </a>
    </li>
    {{ /each }}
</script>

<!-- 牌子排行版模板 D -->

<!-- 销量排行版模板 S -->
<script type="text/template" id="ranking_Tpl">
    {{ each result as value i}}
    <li>
        <a href="#">
            <div class="left">
                {{# value.productImg}}
            </div>
            <div class="right">
                <p class="title">{{# value.productName}}</p>
                <p class="price">{{# value.productPrice}}<em>★★★★★</em></p>
                <p class="info">{{# value.productQuote}} &nbsp;&nbsp; {{# value.productCom}}</p>
            </div>
        </a>
    </li>
    {{ /each }}
</script>
<!-- 销量排行版模板 D -->


<!-- 评论 S -->

<script type="text/template" id="message_Tpl">
    {{ each result as value i}}
    <li>
        <a href="#" class="icon">
            <img src="./1.jpg" alt=""/>
            <p>海信(Hisense) LED50EC550UA 49英寸 超高清4K智能液晶电视</p>
        </a>
        <div class="bottom">
            <a href="#">
                <aside class="name"><p>{{# value.comName}}：<em>★★★★★</em></p><span>{{# value.comTime}}</span></aside>
                <p class="content">{{# value.comContent}}</p>
            </a>
        </div>
    </li>
    {{ /each }}
</script>

<!-- 评论 D -->




<!-- 引入jQuery -->
<script type="application/javascript" src="lib/jquery/jquery.js"></script>

<!-- 引入template 模板插件的js 文件 -->
<script src="lib/template/template.js"></script>

<!-- 引入index.js -->
<script type="application/javascript" src="js/brand.js" charset="UTF-8"></script>
</body>
</html>